<template>
	<view style="padding: 5px;">
		<uni-row>
			<uni-col :span="14">
				<uni-datetime-picker :value="Date.now()" type="date" disabled/>
			</uni-col>
	
			<uni-col :span="9" :offset="1">
				<button type="primary" style="height: 37px;line-height: 37px;" @click="btnClick">早操登记</button>
			</uni-col>
		</uni-row>
		
		<uni-card v-for="(item,index) in exercisesList" :key="index">
			<view>
				<text>班级：{{item.className}}</text>
				<text style="float: right;">姓名：{{item.studentName}}</text>
			</view>
			<view>
				<text>类型：{{getType(item.type)}}</text>
				<text style="float: right;">登记人：{{item.registrantUser}}</text>
			</view>
			<view slot="actions" class="card-actions">
				<view class="card-actions-item" @click="del(item.morningExercisesId)">
					<uni-icons type="trash" size="18" color="#999"></uni-icons>
					<text class="card-actions-item-text">删除</text>
				</view>
			</view>
		</uni-card>
	</view>
</template>

<script>
	import morningExercises from '@/api/modules/morningExercises.js'
	export default {
			data() {
				return {
					exercisesList: [],
				}
			},
			onShow() {
				this.loadMorningExercisesData();
			},
			created() {
				this.loadMorningExercisesData();
			},
			methods: {
				loadMorningExercisesData() {
					morningExercises.listTodayMorningExercises().then(res => {
						this.exercisesList=res.data
					})
				},
				del(id){
					morningExercises.delMorningExercises(id).then(res => {
						this.loadMorningExercisesData();
					})
				},
				btnClick() {
					uni.navigateTo({
						url: "/pages_duty/dormitoryTeacher/morningExercises/morningExercisesAdd"
					})
				},
				getType(type) {
					if(type === 0) {
						return '请假'
					}else if(type === 1) {
						return '临时请假'
					} else {
						return '未到'
					}
				}
			}
		}
</script>

<style>
.card-actions {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
	height: 45px;
	border-top: 1px #eee solid;
}
.card-actions-item {
	display: flex;
	flex-direction: row;
	align-items: center;
}
.card-actions-item-text {
	font-size: 12px;
	color: #666;
	margin-left: 5px;
}
</style>
